<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:jsp="http://java.sun.com/JSP/Page"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:af="http://xmlns.oracle.com/adf/faces/rich"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<title>Liste des films attribués à ce cinéma</title>

	<link rel="stylesheet" href="../styles/style.css" />

	<script>
                function showDialog() {
                        dlg.show();
                }
        </script>
</h:head>

<h:body>
	<h:panelGroup rendered="#{loginBean.loginSucces}">
		<ui:include src="../includes/header.xhtml" />
		<ui:include src="../includes/menu.xhtml" />

		<div id="content">



			<p:dialog id="dlg" header="Créer une séance" widgetVar="dlg"
				modal="true">
				<h:form id="dlgForm">

					<h:panelGrid columns="2" cellpadding="5" border="0">
						<h:outputLabel for="film_name" value="Film" />

						<p:selectOneMenu id="film_name"
							value="#{insererSeanceBean.film_name_create}">
							<f:selectItems
								value="#{insererSeanceBean.namesFilmsAchetesPourUnCinema}" />
						</p:selectOneMenu>


						<h:outputLabel for="heure_debut" value="Heure de début" />
						<p:calendar id="heure_debut"
							value="#{insererSeanceBean.debutSeance_create}" pattern="HH:mm"
							timeOnly="true" stepHour="1" stepMinute="15" minHour="11"
							maxHour="23" />


						<h:outputLabel for="langue" value="Langue" />
						<p:selectOneMenu id="langue"
							value="#{insererSeanceBean.langue_create}">
							<f:selectItem itemLabel="Version Française" itemValue="VF" />
							<f:selectItem itemLabel="Version Originale" itemValue="VO" />
						</p:selectOneMenu>


						<h:outputLabel for="format" value="Format" />
						<p:selectOneMenu id="format"
							value="#{insererSeanceBean.format_create}">
							<f:selectItem itemLabel="Normal" itemValue="SeanceNormale" />
							<f:selectItem itemLabel="3D" itemValue="Seance3D" />
						</p:selectOneMenu>

						<f:facet name="footer">

							<h:panelGroup id="buttonsPanelGroup">
								<h:panelGroup rendered="#{insererSeanceBean.seanceCreated}">
									<p:button id="closeButton" value="Fermer" onclick="dlg.hide()" />
								</h:panelGroup>

								<h:panelGroup rendered="#{!insererSeanceBean.seanceCreated}">
									<p:commandButton id="insertButton" value="Créer la séance"
										actionListener="#{insererSeanceBean.insertListener}"
										update="buttonsPanelGroup, errorMessage, :formContent" />

									<p:commandButton id="cancelButton" value="Annuler"
										actionListener="#{insererSeanceBean.clearData}"
										oncomplete="dlg.hide()" update=":dlg" />
								</h:panelGroup>
							</h:panelGroup>
						</f:facet>

						<h:outputText id="errorMessage"
							value="#{insererSeanceBean.errorMsg}" />
					</h:panelGrid>
				</h:form>
			</p:dialog>


			<p:confirmDialog id="confirmDialog"
				message="Are you sure about destroying the world?"
				header="Initiating destroy process" severity="alert"
				widgetVar="confirmation">

				<p:commandButton id="confirm" value="Yes Sure"
					oncomplete="confirmation.hide()" update=":formContent"
					actionListener="#{insererSeanceBean.removeSelectedSeance}" />

				<p:commandButton id="decline" value="Not Yet"
					onclick="confirmation.hide()" type="button" />
			</p:confirmDialog>


			<!-- Affichage de la liste des salles dans un accordion -->
			<div id="salles">

				<h:form id="formContent">
					<p:tabView id="tabView" var="date"
						value="#{insererSeanceBean.listeDates}" effect="fade"
						activeIndex="#{loginBean.dateTabActiveIndex}">

						<p:tab title="#{insererSeanceBean.getFormatedDate(date)}">
							<p:accordionPanel value="#{insererSeanceBean.sallesDuCinema}"
								var="salle" multiple="false"
								activeIndex="#{loginBean.accordionActiveIndex}">

								<p:tab
									title="Salle #{salle.numero_salle} (#{salle.nombre_place} places)">

									<div class="affectFilmSalleBoutonPlusDiv">
										<p:commandButton value=' + '
											actionListener='#{insererSeanceBean.setDataSelected(salle.numero_salle, date, false)}'
											oncomplete="showDialog()"
											styleClass='affectFilmSalleBoutonPlus' />
									</div>

									<div id="horaires_salle_#{salle.numero_salle}" class="horaires">
										<c:forEach var="i" begin="11" end="23">
											<div id='${i}h00' class='uneHeureWrap'>
												<div class='uneHeure'>${i}h00</div>
											</div>
										</c:forEach>

										<c:forEach var="seance"
											items='#{insererSeanceBean.listeSeances}'>

											<h:panelGroup
												rendered="#{seance.salle.numero_salle == salle.numero_salle and insererSeanceBean.dateEquals(seance.date_seance, date)}">

												<div class="uneSeance"
													style="top: #{seance.hauteurHeureDebut}px; height: #{seance.copie.film.hauteurDuree}px">

													<div class="uneSeanceTitre">#{seance.copie.film.titre}
														(#{seance.langue})</div>
													<!--/p:commandLink-->


													<div class="uneSeanceDeleteWrap">
														<p:commandLink
															actionListener='#{insererSeanceBean.setSeanceSelected(seance, true)}'
															onclick="confirmation.show()">
															<div class="uneSeanceDelete"></div>
														</p:commandLink>
													</div>


												</div>

											</h:panelGroup>
										</c:forEach>
									</div>
								</p:tab>
							</p:accordionPanel>

						</p:tab>

					</p:tabView>
				</h:form>


			</div>




			<!-- Affichage de la liste des films -->

			<div id="listeFilms">
				<fieldset>
					<legend>Films disponibles</legend>

					<p:dataList type="none" id="availableFilms" var="film"
						value="#{insererSeanceBean.filmsAchetesPourUnCinema}">
						<p:panel header="#{film.titre}" styleClass="unFilm">
							<div class="unFilmDesc" style="height: #{film.hauteurDuree}px;">#{film.duree}
								minutes</div>
						</p:panel>

					</p:dataList>
					<div class="clear"></div>
				</fieldset>
			</div>
		</div>


		<ui:include src="../includes/footer.xhtml" />

	</h:panelGroup>

	<h:panelGroup rendered="#{!loginBean.loginSucces}">
		<ui:include src="../includes/authError.xhtml" />
	</h:panelGroup>

</h:body>
</html>